<template>
  <div>
    <div v-if="showbutton"> <el-button @click="submit()"> 填报</el-button></div>
    <table style="width: 100%" border="1" cellspacing="1">
      <tbody>
        <tr>
          <td colspan="1">学校名称</td>
          <td colspan="4"><input type="text" v-model="dataform.orgName" /></td>
          <td colspan="2">法人代表(校长)</td>
          <td colspan="2"><input type="text" v-model="dataform.legalPerson" /></td>
        </tr>
        <tr>
          <td colspan="1">网站地址(选填)</td>
          <td colspan="4"><input type="text" v-model="dataform.intAddress" /></td>
          <td colspan="2">固定电话</td>
          <td colspan="2"><input type="text" v-model="dataform.staticPhone" /></td>
        </tr>
        <tr>
          <td colspan="1" rowspan="2">学校类别(划“√”)</td>
          <td colspan="2">小学</td>
          <td colspan="2">初中</td>
          <td colspan="2">高中</td>
          <td colspan="2">中专/职高/技校</td>
        </tr>
        <tr>
          <td colspan="2"><input type="text" v-model="SchoolCategory.PrimarySchool" /></td>
          <td colspan="2"><input type="text" v-model="SchoolCategory.JuniorHighSchool" /></td>
          <td colspan="2"><input type="text" v-model="SchoolCategory.SeniorHighSchool" /></td>
          <td colspan="2"><input type="text" v-model="SchoolCategory.ProfessionalHighSchool" /></td>
        </tr>
        <tr>
          <td colspan="1" rowspan="2">开展足球阶段(划“√”)</td>
          <td colspan="2">小学</td>
          <td colspan="2">初中</td>
          <td colspan="2">高中</td>
          <td colspan="2">中专/职高/技校</td>
        </tr>
        <tr>
          <td colspan="2"><input type="text" v-model="PlayFootball.PrimarySchool" /></td>
          <td colspan="2"><input type="text" v-model="PlayFootball.JuniorHighSchool" /></td>
          <td colspan="2"><input type="text" v-model="PlayFootball.SeniorHighSchool" /></td>
          <td colspan="2"><input type="text" v-model="PlayFootball.ProfessionalHighSchool" /></td>
        </tr>
        <tr>
          <td colspan="1">在校学生人数</td>
          <td colspan="4"><input type="text" v-model="dataform.onSchoolStudentNum" /></td>
          <td colspan="2" rowspan="2">校足球代表队队员人数</td>
          <td colspan="1">男</td>
          <td colspan="1"><input type="text" v-model="dataform.footballManNum" /></td>
        </tr>
        <tr>
          <td colspan="1">参加足球运动学生人数</td>
          <td colspan="4"><input type="text" v-model="dataform.joinFootballNum" /></td>
          <td colspan="1">女</td>
          <td colspan="1"><input type="text" v-model="dataform.footballWomanNum" /></td>
        </tr>
        <tr>
          <td colspan="1" rowspan="4">所获级别命名授予时间(年份)</td>
          <td colspan="4">国家级定点体校</td>
          <td colspan="4"><input type="text" v-model="dataform.getNationYear" /></td>
        </tr>
        <tr>
          <td colspan="4">省级定点体校</td>
          <td colspan="4"><input type="text" v-model="dataform.getProvinceYear" /></td>
        </tr>
        <tr>
          <td colspan="4">地市级定点体校</td>
          <td colspan="4"><input type="text" v-model="dataform.getCityYear" /></td>
        </tr>
        <tr>
          <td colspan="4">县级定点体校</td>
          <td colspan="4"><input type="text" v-model="dataform.getCountyYear" /></td>
        </tr>
        <tr>
          <td colspan="1" rowspan="7">足球场地</td>
          <td colspan="2" rowspan="2">类型/名称</td>
          <td colspan="2" rowspan="2">数量(个)</td>
          <td colspan="1" rowspan="2">面积(平方米)</td>
          <td colspan="3">场地质量规划(划 "√")</td>
        </tr>
        <tr>
          <td colspan="1">草皮</td>
          <td colspan="1">塑胶</td>
          <td colspan="1">其他</td>
        </tr>
        <tr>
          <td colspan="2">11人标准场地</td>
          <td colspan="2"><input type="text" v-model="dataform.fSheet8bList[0].num" /></td>
          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[0].acreage" /></td>

          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[0].type" /></td>
          <td colspan=" 1"><input type="text" v-model="dataform.fSheet8bList[0].type2" /> </td>
          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[0].type3" /></td>
        </tr>
        <tr>
          <td colspan="2">7人制场地</td>
          <td colspan="2"><input type="text" v-model="dataform.fSheet8bList[1].num" /></td>
          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[1].acreage" /></td>


          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[1].type" /></td>
          <td colspan=" 1"><input type="text" v-model="dataform.fSheet8bList[1].type2" /> </td>
          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[1].type3" /></td>
        </tr>
        <tr>
          <td colspan="2">5人制场地</td>
          <td colspan="2"><input type="text" v-model="dataform.fSheet8bList[2].num" /></td>
          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[2].acreage" /></td>


          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[2].type" /></td>
          <td colspan=" 1"><input type="text" v-model="dataform.fSheet8bList[2].type2" /> </td>
          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[2].type3" /></td>
        </tr>
        <tr>
          <td colspan="2">室内5人制场地</td>
          <td colspan="2"><input type="text" v-model="dataform.fSheet8bList[3].num" /></td>
          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[3].acreage" /></td>

          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[3].type" /></td>
          <td colspan=" 1"><input type="text" v-model="dataform.fSheet8bList[3].type2" /> </td>
          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[3].type3" /></td>
        </tr>
        <tr>
          <td colspan="2">其他场地</td>
          <td colspan="2"><input type="text" v-model="dataform.fSheet8bList[4].num" /></td>
          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[4].acreage" /></td>


          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[4].type" /></td>
          <td colspan=" 1"><input type="text" v-model="dataform.fSheet8bList[4].type2" /> </td>
          <td colspan="1"><input type="text" v-model="dataform.fSheet8bList[4].type3" /></td>
        </tr>
        <tr>
          <td colspan="1" rowspan="3">经费投入</td>
          <td colspan="4">当年体育经费投入(万元)</td>
          <td colspan="4">当年足球经费投入(万元)</td>
        </tr>
        <tr>
          <td colspan="2">数量</td>
          <td colspan="2">是否够用</td>
          <td colspan="2">数量</td>
          <td colspan="2">是否够用</td>
        </tr>
        <tr>
          <td colspan="2"><input type="text" v-model="dataform.currentYearSportNum" /></td>
          <td colspan="2"><input type="text" v-model="dataform.currentYearSportUserState" /></td>
          <td colspan="2"><input type="text" v-model="dataform.currentYearFootballNum" /></td>
          <td colspan="2"><input type="text" v-model="dataform.currentYearFootballUserState" /></td>
        </tr>

        <tr>
          <td colspan="1" rowspan="6">足球师资</td>
          <td colspan="4">足球专业的足球教师/教练</td>
          <td colspan="4">足球裁判员</td>
        </tr>
        <tr>
          <td colspan="2">A级以上</td>
          <td colspan="2"><input type="text" v-model="dataform.teacherANum" /></td>
          <td colspan="2">国家级级以上</td>
          <td colspan="2"><input type="text" v-model="dataform.judgeNationNum" /></td>
        </tr>
        <tr>
          <td colspan="2">B级以上</td>
          <td colspan="2"><input type="text" v-model="dataform.teacherBNum" /></td>
          <td colspan="2">1级</td>
          <td colspan="2"><input type="text" v-model="dataform.judgeLevelOneNum" /></td>
        </tr>
        <tr>
          <td colspan="2">C级以上</td>
          <td colspan="2"><input type="text" v-model="dataform.teachercNum" /></td>
          <td colspan="2">2级</td>
          <td colspan="2"><input type="text" v-model="dataform.judgeLevelTwoNum" /></td>
        </tr>
        <tr>
          <td colspan="2">D级以上</td>
          <td colspan="2"><input type="text" v-model="dataform.teacherDNum" /></td>
          <td colspan="2">3级</td>
          <td colspan="2"><input type="text" v-model="dataform.judgeLevelThreeNum" /></td>
        </tr>
        <tr>
          <td colspan="2">合计</td>
          <td colspan="2"><input type="text" v-model="dataform.teacherTotalNum" /></td>
          <td colspan="2">合计</td>
          <td colspan="2"><input type="text" v-model="dataform.judgeTotalNum" /></td>
        </tr>
        <tr>
          <td colspan="1" rowspan="3">开展足球项目情况(划“√”)</td>
          <td colspan="4">是否青少年足球俱乐部</td>
          <td colspan="4"><input type="text" v-model="FootballProject.FootballClub" /></td>
        </tr>
        <tr>
          <td colspan="2">是否开展校内联赛</td>
          <td colspan="2"><input type="text" v-model="FootballProject.IntramuralLeague" /></td>
          <td colspan="2" rowspan="2">是否参加冬夏令营</td>
          <td colspan="1">夏令营</td>
          <td colspan="1"><input type="text" v-model="FootballProject.SummerCamp" /></td>
        </tr>
        <tr>
          <td colspan="2">是否开展校际联赛</td>
          <td colspan="2"><input type="text" v-model="FootballProject.IntercollegiateLeague" /></td>
          <td colspan="1">冬令营</td>
          <td colspan="1"><input type="text" v-model="FootballProject.WinterCamp" /></td>
        </tr>
        <tr>
          <td colspan="1" rowspan="2">开展业余足球训练情况(相应选项后划“√”)</td>
          <td colspan="3">学校与体育部门合办</td>
          <td colspan="3">学校自办</td>
          <td colspan="2">学校与社会合办</td>
        </tr>
        <tr>
          <td colspan="3"><input type="text" v-model="AmateurFootball.SportsDepartmen" /></td>
          <td colspan="3"><input type="text" v-model="AmateurFootball.Runbytheschool" /></td>
          <td colspan="2"><input type="text" v-model="AmateurFootball.SocialJointOperation" /></td>
        </tr>
        <tr>
          <td colspan="1" rowspan="3">足球课程教学</td>
          <td colspan="2">必修课时</td>
          <td colspan="1"><input type="text" v-model="dataform.mustCourseTime" /></td>
          <td colspan="2" rowspan="3">教材</td>
          <td colspan="2">国家</td>
          <td colspan="1"><input type="text" v-model="bookTypeList.nation" /></td>
        </tr>
        <tr>
          <td colspan="2">选修课时</td>
          <td colspan="1"><input type="text" v-model="dataform.chooseCourseTime" /></td>
          <td colspan="2">地方</td>
          <td colspan="1"><input type="text" v-model="bookTypeList.place" /></td>
        </tr>
        <tr>
          <td colspan="2">每周综合活动时间(小时)</td>
          <td colspan="1"><input type="text" v-model="dataform.weekActivityTime" /></td>
          <td colspan="2">校本</td>
          <td colspan="1"><input type="text" v-model="bookTypeList.CheckedEdition" /></td>
        </tr>
        <tr>
          <td colspan="1" rowspan="4">场馆开放情况(相应选项后划“√”)</td>
          <td colspan="3" rowspan="2">是否开放</td>
          <td colspan="3">是</td>
          <td colspan="2"><input type="text" v-model="openStateList.yes" /></td>
        </tr>
        <tr>
          <td colspan="3">否</td>
          <td colspan="2"><input type="text" v-model="openStateList.no" /></td>
        </tr>
        <tr>
          <td colspan="3" rowspan="2">开放类型</td>
          <td colspan="3">每天开放</td>
          <td colspan="2"><input type="text" v-model="openTypeList.everyday" /></td>
        </tr>
        <tr>
          <td colspan="3">节假日开放</td>
          <td colspan="2"><input type="text" v-model="openTypeList.holiday" /></td>
        </tr>
        <tr>
          <td colspan="1" rowspan="2">已输送的情况(累计)</td>
          <td colspan="1">国家队</td>
          <td colspan="1">省队</td>
          <td colspan="1">市队</td>
          <td colspan="2">高校高水平运动队</td>
          <td colspan="3">其他</td>
        </tr>
        <tr>
          <td colspan="1"><input type="text" v-model="dataform.transportNationNum" /></td>
          <td colspan="1"><input type="text" v-model="dataform.transportProvinceNum" /></td>
          <td colspan="1"><input type="text" v-model="dataform.transportCityNum" /></td>
          <td colspan="2"><input type="text" v-model="dataform.transportHighSchoolNum" /></td>
          <td colspan="3"><input type="text" v-model="dataform.transportOtherNum" /></td>
        </tr>
        <tr>
          <td colspan="1" :rowspan="totalActivityRows">参加的活动和获得的荣誉与奖励(自2011年起)</td>
          <td colspan="1" :rowspan="additionalNationalRows + 1">全国性
            <el-tooltip content="右键点击输入框可以新增或删除行" placement="top" effect="light">
              <span style="color: #666; font-size: 12px; cursor: help;">ⓘ</span>
            </el-tooltip>
          </td>
          <td colspan="1">参加时间</td>
          <td colspan="6">比赛/活动名称、奖励和荣誉</td>
        </tr>
        <template v-for="(item, index) in dataform.fSheet8eList.filter(item => item.joinActivityTypeId === 1)">
          <tr>
            <td colspan="1">
              <input type="text" v-model="item.joinTime"
                @contextmenu.prevent="showActivityContextMenu($event, index, 'national')" />
            </td>
            <td colspan="6">
              <input type="text" v-model="item.result"
                @contextmenu.prevent="showActivityContextMenu($event, index, 'national')" />
            </td>
          </tr>
        </template>

        <tr>
          <td colspan="1" :rowspan="additionalProvincialRows + 1">省市级
            <el-tooltip content="右键点击输入框可以新增或删除行" placement="top" effect="light">
              <span style="color: #666; font-size: 12px; cursor: help;">ⓘ</span>
            </el-tooltip>
          </td>
          <td colspan="1">参加时间</td>
          <td colspan="6">比赛/活动名称、奖励和荣誉</td>
        </tr>
        <template v-for="(item, index) in dataform.fSheet8eList.filter(item => item.joinActivityTypeId === 2)">
          <tr>
            <td colspan="1">
              <input type="text" v-model="item.joinTime"
                @contextmenu.prevent="showActivityContextMenu($event, index, 'provincial')" />
            </td>
            <td colspan="6">
              <input type="text" v-model="item.result"
                @contextmenu.prevent="showActivityContextMenu($event, index, 'provincial')" />
            </td>
          </tr>
        </template>

        <tr>
          <td colspan="1" :rowspan="additionalOtherRows + 1">其他活动
            <el-tooltip content="右键点击输入框可以新增或删除行" placement="top" effect="light">
              <span style="color: #666; font-size: 12px; cursor: help;">ⓘ</span>
            </el-tooltip>
          </td>
          <td colspan="1">参加时间</td>
          <td colspan="6">比赛/活动名称、奖励和荣誉</td>
        </tr>
        <template v-for="(item, index) in dataform.fSheet8eList.filter(item => item.joinActivityTypeId === 3)">
          <tr>
            <td colspan="1">
              <input type="text" v-model="item.joinTime"
                @contextmenu.prevent="showActivityContextMenu($event, index, 'other')" />
            </td>
            <td colspan="6">
              <input type="text" v-model="item.result"
                @contextmenu.prevent="showActivityContextMenu($event, index, 'other')" />
            </td>
          </tr>
        </template>
      </tbody>
    </table>
    <div style="display: flex; justify-content: space-between;">
      <div>填表人：<input type="text" v-model="dataform.writePeople" /></div>
      <div>联系电话：<input type="text" v-model="dataform.writePhone" /></div>
    </div>
    <div style="display: flex; justify-content: space-between;">
      <div>填报时间：<input type="text" v-model="dataform.writeTime" /></div>
      <div>填报单位：<input type="text" v-model="dataform.orgName" /></div>
    </div>
    <!-- 添加右键菜单 -->
    <div v-if="showMenu" :style="menuStyle" class="context-menu">
      <div @click="addRow" class="menu-item">新增一行</div>
      <div @click="deleteRow" class="menu-item">删除这行</div>
    </div>
  </div>
</template>

<script>
  import qs from 'qs'
  import {
    insert_update_sheet8
  } from '@/api/statistics.js'
  export default {
    props: {
      Alldata: {
        type: Object,
        default: {}
      },
    },
    data() {
      return {
        showbutton: true,
        dataform: {
          orgName: '',
          legalPerson: '',
          intAddress: '',
          staticPhone: '',
          schoolType: '',
          footballType: '',
          onSchoolStudentNum: "",
          joinFootballNum: '',
          footballManNum: '',
          footballWomanNum: '',
          getNationYear: '',
          getProvinceYear: '',
          getCityYear: '',
          getCountyYear: '',
          writePeople: '',
          writeTime: '',
          writePhone: '',
          fSheet8bList: [{
              footballName: '',
              num: '',
              acreage: '',
              type: '', //1草皮 2塑胶 3其他
              type2: '', //虚假字段前端自己定义为type准备后端不接收
              type3: '', //虚假字段前端自己定义为type准备后端不接收
            },
            {
              footballName: '',
              num: '',
              acreage: '',
              type: '',
              type2: '', //虚假字段前端自己定义为type准备后端不接收
              type3: '', //虚假字段前端自己定义为type准备后端不接收
            },
            {
              footballName: '',
              num: '',
              acreage: '',
              type: '' //1草皮 2塑胶 3其他
            },
            {
              footballName: '',
              num: '',
              acreage: '',
              type: '',
              type2: '', //虚假字段前端自己定义为type准备后端不接收
              type3: '', //虚假字段前端自己定义为type准备后端不接收
            },
            {
              footballName: '',
              num: '',
              acreage: '',
              type: '',
              type2: '', //虚假字段前端自己定义为type准备后端不接收
              type3: '', //虚假字段前端自己定义为type准备后端不接收
            },
            {
              footballName: '',
              num: '',
              acreage: '',
              type: '',
              type2: '', //虚假字段前端自己定义为type准备后端不接收
              type3: '', //虚假字段前端自己定义为type准备后端不接收
            },
            {
              footballName: '',
              num: '',
              acreage: '',
              type: '',
              type2: '', //虚假字段前端自己定义为type准备后端不接收
              type3: '', //虚假字段前端自己定义为type准备后端不接收
            },
            {
              footballName: '',
              num: '',
              acreage: '',
              type: '',
              type2: '', //虚假字段前端自己定义为type准备后端不接收
              type3: '', //虚假字段前端自己定义为type准备后端不接收
            }
          ],
          currentYearSportNum: '',
          currentYearSportUserState: '',
          currentYearFootballNum: '',
          currentYearFootballUserState: '',
          teacherANum: '',
          teacherBNum: '',
          teachercNum: '',
          teacherDNum: '',
          teacherTotalNum: '',
          judgeNationNum: '',
          judgeLevelOneNum: '',
          judgeLevelTwoNum: '',
          judgeLevelThreeNum: '',
          judgeTotalNum: '',
          footballProjectState: '',
          trainingState: '',
          mustCourseTime: '',
          chooseCourseTime: '',
          weekActivityTime: '',
          bookType: '', //1国家 2地方 3校本
          openState: '', //1是 2否
          openType: '', // 1每天开放 2节假日开放
          transportNationNum: '',
          transportProvinceNum: '',
          transportCityNum: '',
          transportHighSchoolNum: '',
          transportOtherNum: '',
          fSheet8eList: [{
              joinActivityTypeId: 1, //1全国2省市3其他
              joinTime: '',
              result: ''
            },
            {
              joinActivityTypeId: 1, //1全国2省市3其他
              joinTime: '',
              result: ''
            },
            {
              joinActivityTypeId: 1, //1全国2省市3其他
              joinTime: '',
              result: ''
            },
            {
              joinActivityTypeId: 2,
              joinTime: '',
              result: ''
            },
            {
              joinActivityTypeId: 2,
              joinTime: '',
              result: ''
            },
            {
              joinActivityTypeId: 2,
              joinTime: '',
              result: ''
            },
            {
              joinActivityTypeId: 3,
              joinTime: '',
              result: ''
            },
            {
              joinActivityTypeId: 3,
              joinTime: '',
              result: ''
            },
            {
              joinActivityTypeId: 3,
              joinTime: '',
              result: ''
            }
          ],
        },
        //学校类别 1小学 2初中 3高中 4职高 schoolType 多选
        SchoolCategory: {
          PrimarySchool: "",
          JuniorHighSchool: "",
          SeniorHighSchool: "",
          ProfessionalHighSchool: "",
        },
        //开展足球阶段 1小学 2初中 3高中 4职高 footballType 多选
        PlayFootball: {
          PrimarySchool: "",
          JuniorHighSchool: "",
          SeniorHighSchool: "",
          ProfessionalHighSchool: "",
        },

        //开展足球项目 1是否有足球俱乐部 2是否开展校内联赛 3是否参加校际联赛 4夏令营 5冬令营 footballProjectState 多选
        FootballProject: {
          FootballClub: "",
          IntramuralLeague: "",
          IntercollegiateLeague: "",
          SummerCamp: "",
          WinterCamp: "",
        },
        //业余足球 1与体育部门合办 2学校自办 3与社会合办   trainingState
        AmateurFootball: {
          SportsDepartmen: "",
          Runbytheschool: "",
          SocialJointOperation: "",
        },

        //教材类别 //1国家 2地方 3校本   bookType
        bookTypeList: {
          nation: "",
          place: "",
          CheckedEdition: ""
        },

        //场馆开放情况     //1是 2否      openState
        openStateList: {
          yes: "",
          no: "",
        },

        // 场馆开放类型 1每天开放 2节假日开放  openType: 2,
        openTypeList: {
          everyday: "",
          holiday: "",
        },


        showMenu: false,
        menuStyle: {
          left: '0px',
          top: '0px',
          position: 'fixed',
          zIndex: 9999
        },
        currentSection: 'activity',
        currentRowIndex: -1,
        currentActivityType: ''

      };
    },

    computed: {
      additionalNationalRows() {
        return this.dataform.fSheet8eList.filter(item => item.joinActivityTypeId === 1).length
      },
      additionalProvincialRows() {
        return this.dataform.fSheet8eList.filter(item => item.joinActivityTypeId === 2).length
      },
      additionalOtherRows() {
        return this.dataform.fSheet8eList.filter(item => item.joinActivityTypeId === 3).length
      },
      totalActivityRows() {
        return 3 + this.additionalNationalRows + this.additionalProvincialRows + this.additionalOtherRows
      }
    },

    //更新数据
    watch: {
      Alldata(newValue, oldValue) {

        this.dataform = newValue
        // 场馆开放类型 1每天开放 2节假日开放  openType: 2,
        if (this.dataform.openType == '1') {
          this.openTypeList.everyday = "√"
        } else if (this.dataform.openType == '2') {
          this.openTypeList.holiday = "√"
        }

        //场馆开放情况     //1是 2否      openState
        if (this.dataform.openState == '1') {
          this.openStateList.yes = '√'
        } else if (this.dataform.openState == '2') {
          this.openStateList.no = '√'
        }


        // //教材类别 //1国家 2地方 3校本   bookType

        if (this.dataform.bookType == '1') {
          this.bookTypeList.nation = "√"
        } else if (this.dataform.bookType == '2') {
          this.bookTypeList.place = '√'
        } else if (this.dataform.bookType == '3') {
          this.bookTypeList.CheckedEdition = '√'
        }

        //业余足球 1与体育部门合办 2学校自办 3与社会合办   trainingState
        if (this.dataform.trainingState == '1') {
          this.AmateurFootball.SportsDepartmen = '√'
        } else if (this.dataform.trainingState == '2') {
          this.AmateurFootball.Runbytheschool = '√'
        } else if (this.dataform.trainingState == '3') {
          this.AmateurFootball.SocialJointOperation = '√'
        }

        //开展足球项目 1是否有足球俱乐部 2是否开展校内联赛 3是否参加校际联赛 4夏令营 5冬令营 footballProjectState 多选
        if (this.dataform.footballProjectState) {

          this.dataform.footballProjectState.split(',').forEach((item) => {
            if (item == '1') {
              this.FootballProject.FootballClub = '√'
            }
            if (item == '2') {
              this.FootballProject.IntramuralLeague = '√'
            }
            if (item == '3') {
              this.FootballProject.IntercollegiateLeague = '√'
            }
            if (item == '4') {
              this.FootballProject.SummerCamp = '√'
            }
            if (item == '5') {
              this.FootballProject.WinterCamp = '√'
            }
          })
        }

        //开展足球阶段 1小学 2初中 3高中 4职高 footballType 多选
        if (this.dataform.footballType) {

          this.dataform.footballType.split(',').forEach((item) => {
            if (item == '1') {
              this.PlayFootball.PrimarySchool = '√'
            }
            if (item == '2') {
              this.PlayFootball.JuniorHighSchool = '√'
            }
            if (item == '3') {
              this.PlayFootball.SeniorHighSchool = '√'
            }
            if (item == '4') {
              this.PlayFootball.ProfessionalHighSchool = '√'
            }
          })
        }

        //学校类别 1小学 2初中 3高中 4职高 schoolType 多选
        if (this.dataform.schoolType) {

          this.dataform.schoolType.split(',').forEach((item) => {
            if (item == '1') {
              this.SchoolCategory.PrimarySchool = '√'
            }
            if (item == '2') {
              this.SchoolCategory.JuniorHighSchool = '√'
            }
            if (item == '3') {
              this.SchoolCategory.SeniorHighSchool = '√'
            }
            if (item == '4') {
              this.SchoolCategory.ProfessionalHighSchool = '√'
            }
          })
        }

      }

    },



    methods: {

      showbuut() {
        this.showbutton = false
      },


      submit() {
        // console.log(this.dataform.fSheet8bList);
        //业余足球 1与体育部门合办 2学校自办 3与社会合办   trainingState
        if (this.AmateurFootball.SportsDepartmen) {
          this.dataform.trainingState = 1
        } else if (this.AmateurFootball.Runbytheschool) {
          this.dataform.trainingState = 2
        } else if (this.AmateurFootball.SocialJointOperation) {
          this.dataform.trainingState = 3
        }

        //开展足球项目 1是否有足球俱乐部 2是否开展校内联赛 3是否参加校际联赛 4夏令营 5冬令营 footballProjectState 多选
        const footballProjectStatelist = []
        if (this.FootballProject.FootballClub) {
          footballProjectStatelist.push('1')
        }
        if (this.FootballProject.IntramuralLeague) {
          footballProjectStatelist.push('2')
        }
        if (this.FootballProject.IntercollegiateLeague) {
          footballProjectStatelist.push('3')
        }
        if (this.FootballProject.SummerCamp) {
          footballProjectStatelist.push('4')
        }
        if (this.FootballProject.WinterCamp) {
          footballProjectStatelist.push('5')
        }
        this.dataform.footballProjectState = footballProjectStatelist.toString()

        //开展足球阶段 1小学 2初中 3高中 4职高 footballType 多选
        const footballTypelist = []
        if (this.PlayFootball.PrimarySchool) {
          footballTypelist.push('1')
        }
        if (this.PlayFootball.JuniorHighSchool) {
          footballTypelist.push('2')
        }
        if (this.PlayFootball.SeniorHighSchool) {
          footballTypelist.push('3')
        }
        if (this.PlayFootball.ProfessionalHighSchool) {
          footballTypelist.push('4')
        }
        this.dataform.footballType = footballTypelist.toString()


        //学校类别 1小学 2初中 3高中 4职高 schoolType 多选
        const schoolTypelist = []
        if (this.SchoolCategory.PrimarySchool) {
          schoolTypelist.push('1')
        }
        if (this.SchoolCategory.JuniorHighSchool) {
          schoolTypelist.push('2')
        }
        if (this.SchoolCategory.SeniorHighSchool) {
          schoolTypelist.push('3')
        }
        if (this.SchoolCategory.ProfessionalHighSchool) {
          schoolTypelist.push('4')
        }

        this.dataform.schoolType = schoolTypelist.toString()

        // //教材类别 //1国家 2地方 3校本   bookType

        if (this.bookTypeList.nation) {
          this.dataform.bookType = 1
        } else if (this.bookTypeList.place) {
          this.dataform.bookType = 2
        } else if (this.bookTypeList.CheckedEdition) {
          this.dataform.bookType = 3
        }

        //场馆开放情况     //1是 2否      openState
        if (this.openStateList.yes) {
          this.dataform.openState = 1
        } else if (this.openStateList.no) {
          this.dataform.openState = 2
        }

        // 场馆开放类型 1每天开放 2节假日开放  openType: 2,
        if (this.openTypeList.everyday) {
          this.dataform.openType = 1
        } else if (this.openTypeList.holiday) {
          this.dataform.openType = 2
        }

        this.dataform.fSheet8bList.forEach((item) => {
          if (item.type) {
            item.type = 1
          } else if (item.type2) {
            item.type = 2
          } else if (item.type3) {
            item.type = 3
          }
        })

        // console.log(qs.stringify(this.dataform));
        insert_update_sheet8(this.dataform).then(res => {
          this.$message.success('填报成功')
        })
      },

      hideContextMenu() {
        this.showMenu = false
      },

      showActivityContextMenu(event, index, type) {
        console.log('Right click triggered', { index, type }) // 调试日志
        event.preventDefault()
        event.stopPropagation()

        this.showMenu = true
        this.currentSection = 'activity'
        this.currentActivityType = type
        this.currentRowIndex = index

        // 计算菜单位置
        const x = event.clientX
        const y = event.clientY

        this.menuStyle = {
          left: `${x}px`,
          top: `${y}px`,
          position: 'fixed',
          zIndex: 9999
        }

        console.log('Menu should be visible', this.showMenu) // 调试日志
      },

      addRow() {
        console.log('Adding row', this.currentActivityType) // 调试日志
        const newActivity = {
          joinActivityTypeId: this.currentActivityType === 'national' ? 1 : this.currentActivityType ===
            'provincial' ? 2 : 3,
          joinTime: '',
          result: ''
        }

        this.dataform.fSheet8eList.push(newActivity)
        this.hideContextMenu()
      },

      deleteRow() {
        console.log('Deleting row', this.currentActivityType) // 调试日志
        const typeId = this.currentActivityType === 'national' ? 1 :
          this.currentActivityType === 'provincial' ? 2 : 3

        const activities = this.dataform.fSheet8eList.filter(item => item.joinActivityTypeId === typeId)

        if (activities.length <= 1) {
          Message.warning('至少保留一行')
          return
        }

        const deleteIndex = this.dataform.fSheet8eList.indexOf(activities[this.currentRowIndex])
        if (deleteIndex !== -1) {
          this.dataform.fSheet8eList.splice(deleteIndex, 1)
        }

        this.hideContextMenu()
      }

    },

    mounted() {
      // 添加点击事件监听器来关闭菜单
      document.addEventListener('click', (e) => {
        if (!e.target.closest('.context-menu')) {
          this.hideContextMenu()
        }
      })
    },

    beforeDestroy() {
      document.removeEventListener('click', this.hideContextMenu)
    }
  }
</script>


<style>
  table {
    border-collapse: collapse;
    /* //合并为一个单一的边框 */
    border-color: #a2a7ab;
    /* //边框颜色按实际自定义即可 */
    margin-bottom: 10px;
  }

  thead tr th {
    background-color: #f8f8f9;
    /* //设置表格标题背景色 */
    padding: 3px;
    text-align: center;
  }

  tbody tr td {
    padding: 3px;
    text-align: center;
    height: 34px;
    /* //设置单元格最小高度 */
  }

  .context-menu {
    position: fixed;
    background: white;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 5px 0;
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
    z-index: 9999;
  }

  .menu-item {
    padding: 8px 12px;
    cursor: pointer;
    white-space: nowrap;
  }

  .menu-item:hover {
    background-color: #f5f5f5;
  }

  input {
    width: 100%;
    box-sizing: border-box;
    padding: 4px;
  }
</style>
